<template>
  <view class="aiReplyBottom">
    <kk-line class="line" />
    <view class="item" @tap="itemClick">
      <image
        class="item-icon"
        src="@/pagesA/static/images/chat/chat_ai_reply.png"
      ></image>
      <view class="item-text"> AI回复 </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from "vue";

const itemClick = (item: any) => {
  emit("aiReplySelectConversation");
};
const emit = defineEmits(["aiReplySelectConversation"]);
</script>

<style lang="scss" scoped>
.aiReplyBottom {
  position: fixed;
  bottom: 0;
  width: calc(100vw);
  background: #f1f2f3;
  height: calc(136rpx + env(safe-area-inset-bottom));
  z-index: 999;
  .line {
    background: #e5e7eb;
  }
  .item {
    margin-top: 16rpx;
    margin-left: 20rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 120rpx;
    &-icon {
      width: 70rpx;
      height: 70rpx;
    }
    &-text {
      padding-top: 8rpx;
      font-size: 24rpx;
      color: #666;
      line-height: 28rpx;
    }
  }
}
</style>
